<template>
  <el-dialog
    title="新闻栏目"
    :visible.sync="dialogVisible"
    size="60%"
    custom-class="search-result-pop"
    :before-close="handleClose"
  >
    <div style="margin-bottom: 30px">
      <FormGroup
        style="margin-top: 20px"
        :searchConfig="addColumnConfig"
        ref="formParams"
        labelWidth="120px"
        labelPosition="right"
      />
    </div>
    <span class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary" @click="handleConfirm">确 定</el-button>
    </span>
  </el-dialog>
</template>
<script>
import FormGroup from "@/views/components/FormGroup";
import { TYPE, addColumnConfig } from "../initData";
import FileUpload from "@/components/FileUpload";
import {
  createNewsStudyType,
  updateNewsStudyType,
} from "@/api/content-manage/researchResult.js";
export default {
  name: "AddPop",
  components: {
    FormGroup,
    FileUpload,
  },
  data() {
    return {
      dialogVisible: false,
      addColumnConfig: JSON.parse(JSON.stringify(addColumnConfig)),
      row: {},
      popType: "",
    };
  },
  methods: {
    open({ popType, row }) {
      this.dialogVisible = true;
      this.row = row ? JSON.parse(row) : {};
      this.popType = popType;
      if (popType === "edit") {
        const newConfig = JSON.parse(JSON.stringify(addColumnConfig));
        const data = JSON.parse(row);
        const keys = Object.keys(data);
        keys.forEach((v) => {
          newConfig.forEach((ele) => {
            if (ele.keyIndex === v) {
              ele.value = data[v];
            }
          });
        });
        this.addColumnConfig = newConfig;
      } else {
        this.addColumnConfig = JSON.parse(JSON.stringify(addColumnConfig));
      }
      this.$refs.formParams && this.$refs.formParams.resetFields();
    },
    handleClose() {
      this.dialogVisible = false;
      this.addColumnConfig = JSON.parse(JSON.stringify(addColumnConfig));
    },
    async handleConfirm() {
      const fromParams =
        this.$refs.formParams && (await this.$refs.formParams.getParams());
      this[this.popType](fromParams);
    },
    async add(fromParams) {
      const { code, msg } = await createNewsStudyType({
        type: TYPE,
        name: fromParams.name,
        status: fromParams.status,
      });
      if (code !== 0) {
        this.$message.error(msg);
        return;
      }
      this.$message.success("新增成功");
      this.$emit("success");
      this.handleClose();
    },
    async edit(fromParams) {
      const { code, msg } = await updateNewsStudyType({
        type: TYPE,
        name: fromParams.name,
        status: fromParams.status,
        id: this.row.id,
      });
      if (code !== 0) {
        this.$message.error(msg);
        return;
      }
      this.$message.success("新增成功");
      this.$emit("success");
      this.handleClose();
    },
  },
};
</script>

<style lang="scss">
.search-result-pop {
  .el-drawer__body {
    padding: 15px 20px;
  }
  .basic-infos {
    .title {
      padding: 3px 10px;
      border-left: 2px solid rgb(20, 165, 232);
      margin-bottom: 20px;
    }
  }
}
</style>
